<!-- 免密登录页 -->
<template>
	<view class="uni-content1">
		<image src="https://gkms.bckjkj.com/profile/uni/images/logo.png" mode="aspectFit" :draggable="false" />
		<view class="login-miaosu">
			<text>登录免费查看全国高校招生录取数据享受更多高考服务</text>
		</view>
		<view class="mt20 mb20">
			<button type="default" class="dark-green-btn" @click="quickLogin">微信用户一键登录</button>
		</view>
		<!-- 带选择框的隐私政策协议组件 -->
		<agreements scope="login" ref="agreements"></agreements>
	</view>
	<view>
		<!-- 普通弹窗 -->
		<uni-popup ref="popup">
			<view class="popup-content">
				<!-- 顶部文字 -->
				<text class="popup-title mb10">微信授权登录</text>
				<!-- 快捷登录框 当url带参数时有效 -->
				<text class="fs12">将根据第三方账号服务平台的授权范围获取你的信息</text>
				<button type="default" class="button dark-green-btn-hbr" @click="goWxLogin">允 许</button>
				<button class="button cancle-btn-circle" plain @click="closePopup">取 消</button>
			</view>
		</uni-popup>
	</view>
	<!-- 悬浮登录方式组件 -->
	<!-- <view class="fab-login-box">
		<view class="item" @click="toPwdLogin()">
			<uni-icons type="auth" size="30"></uni-icons>
			<text class="login-title">密码登录</text>
		</view>
	</view> -->
	<!-- 未绑定或未注册 -->
	<view>
		<uni-popup ref="bindAndRegister" type="dialog">
			<uni-popup-dialog type="warn" cancelText="注册" confirmText="绑定" title="提示" content="微信未注册或未绑定"
				@confirm="navigateToFun('/pages/ucenter/bind/index')"
				@close="navigateToFun('/pages/ucenter/register/register')"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import agreements from '../agreement/index.vue';
	import mixin from '../common/js/login-page.mixin.js';
	export default {
		components: {
			agreements
		},
		mixins: [mixin],
		data() {
			return {}
		},
		onLoad() {},
		methods: {
			quickLogin(e) {
				uni.showLoading({
					title: '加载中'
				});
				if (this.needAgreements && !this.agree) {
					setTimeout(() => {
						uni.hideLoading()
						this.$refs.agreements.popup(this.quickLogin)
					}, 1000)
					return true
				}
				setTimeout(() => {
					uni.hideLoading()
					this.$refs.popup.open("bottom")
				}, 1000)
			},
			goWxLogin() {
				this.closePopup()
				const openid = uni.getStorageSync('userOpenId');
				if (openid === "" || openid === null || openid === undefined) {
					uni.login({
						success: res => {
							//wx接口路径
							this.$get("/wx/interface/getOpenId/" + res.code).then(res => {
								console.log(res)
								const openIdBack = res.msg
								if (openIdBack !== "") {
									uni.setStorage({
										key: "userOpenId",
										data: openIdBack
									})
									this.alreadyHaveOpenId(openIdBack)
								} else {
									uni.showToast({
										title: "获取微信openid失败",
										icon: 'none'
									});
								}
							}).catch(e => {
								uni.showToast({
									title: "获取微信openid失败",
									icon: 'none'
								});
							})
						}
					})
				} else {
					this.alreadyHaveOpenId(openid)
				}
			},
			alreadyHaveOpenId(openid) {
				uni.showLoading({
					title: '加载中'
				});
				let data = {
					openId: openid
				}
				this.$post(this.$api.wx.ucenter.wxLogin, data).then(res => {
					if (res.haveAccount) { //openid存在执行
						uni.setStorage({
							key: "gkms-userInfo",
							data: res.userInfo
						})
						uni.setStorage({
							key: "token",
							data: res.token
						})
						uni.showToast({
							title: "登录成功",
							icon: 'success'
						});
						setTimeout(() => {
							this.$loginSuccessGoFun()
						}, 1500)
					} else { //openid不存在执行，包括有账号没绑定和无账号
						this.$refs.bindAndRegister.open()
					}
				}).catch(e => {
					uni.showToast({
						title: e.data.msg,
						icon: 'none'
					});
				})
			},
			closePopup() {
				this.$refs.popup.close()
			},
			//去密码登录页
			toPwdLogin() {
				uni.navigateTo({
					url: '/pages/ucenter/login/pwdLogin'
				})
			},
			navigateToFun(url) {
				uni.navigateTo({
					url: url,
					fail(e) {
						console.error(e);
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "../common/style/uc-common.scss";

	.login-miaosu {
		text-align: center;
		padding: 0 40px 40px;
		font-size: 14px;
		color: #333;
	}

	.popup-content {
		align-items: center;
		justify-content: center;
		padding: 15px;
		height: 500rpx;
		background-color: #FFF;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
	}

	.popup-title {
		display: flex;
		font-size: 20px;
		font-weight: 800;
		flex-direction: column;
	}

	.button {
		margin-top: 25px;
		width: 80%;
	}

	/* #ifndef APP-NVUE */
	.fab-login-box,
	.item {
		display: flex;
		box-sizing: border-box;
		flex-direction: column;
	}

	/* #endif */
	.fab-login-box {
		// background-color: #FFF;
		flex-direction: row;
		flex-wrap: wrap;
		width: 750rpx;
		justify-content: space-around;
		position: fixed;
		left: 0;
	}

	.item {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: 200rpx;
		cursor: pointer;
	}

	/* #ifndef APP-NVUE */
	@media screen and (min-width: 690px) {
		.fab-login-box {
			max-width: 500px;
			margin-left: calc(50% - 250px);
		}

		.item {
			height: 160rpx;
		}
	}

	@media screen and (max-width: 690px) {
		.fab-login-box {
			bottom: 10rpx;
		}
	}

	/* #endif */
	.logo {
		width: 60rpx;
		height: 60rpx;
		max-width: 40px;
		max-height: 40px;
		border-radius: 100%;
		border: solid 1px #F6F6F6;
	}

	.login-title {
		text-align: center;
		margin-top: 6px;
		color: #999;
		font-size: 10px;
		width: 70px;
	}
</style>
